.container {
  display: flex;
  align-items: center;

  .is-hidden {
    opacity: 0;
  }

  .is-visible {
    opacity: 1;
  }

  p {
    margin: 0;
  }
}

.icon {
  width: 22px;
  height: 22px;

  svg {
    width: 100%;
    height: 100%;
  }
}

.message {
  margin: 0 0 0 6px;
}

.errorIcon {
  svg path {
    fill: var(--notifications-error-icon-color);
  }
}

.warnIcon {
  svg path {
    opacity: 0.3;
  }
}

.successIcon {
  svg path {
    fill: var(--notifications-success-icon-color);
  }
}

.warning {
  opacity: 0.75;
}
